// 导入createVNode和render函数，用于创建和渲染虚拟DOM
import { createVNode, render } from 'vue'
// 导入context-menu组件
import contextMenu from './context-menu.vue'
// 导入IContextMenuItem类型
import type { IContextMenuItem } from './type'
// 创建createContextMenu函数，用于创建上下文菜单
export const createContextMenu = (
  // 传入的菜单项数组
  actions: IContextMenuItem[],
  // 触发菜单的字符串
  tirgger?: string
) => {
  // 创建context-menu组件的虚拟DOM
  const vm = createVNode(contextMenu, { menuItems: actions, tirgger })
  // 创建一个div容器
  const divContainer = document.createElement('div')
  // 将虚拟DOM渲染到div容器中
  render(vm, divContainer)
  // 将div容器添加到body中
  document.body.appendChild(divContainer)
  // 返回一个函数，用于销毁上下文菜单
  return () => {
    // 将div容器中的内容清空
    render(null, divContainer)
    // 将div容器从body中移除
    document.body.removeChild(divContainer)
  }
}
